2、在元素内容之后加一个块级元素，设置左右两侧不能有浮动元素，就可以防止父元素高度塌陷。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css</title>
<link rel="stylesheet" href="rerest.css">
<style type="text/css">
ul{width:420px;border:1px solid red;margin:50px auto;height:200px }
.a,.b,.c{width:100px; height:100px; color:white; text-align:center; line-height:100px; font-size:30px; }
.a,.b,.c{ float:left}
.a{background:green;}
.b{background:blue;}
.c{background:orange;}
.d{background:gray;}
</style>
</head>
<body>
<ul>
<li class="a">1</li>
<li class="b">2</li>
<li class="c">3</li>
<li class="d">我要好好学习</li>
</ul>
</body>
</html>
在元素内容加上一个块级元素，这个块级元素会有浮动元素后面自动补行
返回值：
加上新增块级元素后，再加上两侧不能浮动，可以看到高度不再塌陷：
.d{background:gray;clear:both;}
返回值：
再去块级元素的文字：
<li class="d"></li>
